<!doctype html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link href="/favicon.png" rel="bookmark" type="image/png">
    <link href="/favicon.png" rel="icon" type="image/png">
    <link href="/favicon.png" rel="short icon" type="image/png">
    <meta name="csrf-parm" th:content="${session.csrfParm}" />
    <meta name="csrf-token" th:content="${session.csrfToken}" />
    <link rel="stylesheet" href="/libs/twitter-bootstrap/4.0.0/css/bootstrap.min.css">
    <link rel="stylesheet" href="/libs/bootstrap-select/1.12.4/css/bootstrap-select.min.css">
    <link rel="stylesheet" href="/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.min.css">
    <link rel="stylesheet" href="/css/fontawesome-all.css">
    <link rel="stylesheet" href="/css/layout.css">
    <title>报废机动车回收管理系统</title>
</head>

<body>
    <nav id="navbar" class="navbar navbar-expand-lg navbar-light bg-light sticky-top">
        <a class="navbar-brand" href="/">
            <img src="/images/logo.png" alt="logo">
            <span>报废机动车回收管理系统</span>
        </a>
        <button class="navbar-toggler collapsed" type="button" data-toggle="collapse" data-target="#navbar-items">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div id="navbar-items" class="navbar-collapse collapse">
            <ul class="navbar-nav mr-auto">
                <li class="nav-item" th:classappend="${session.page == 'order' ? 'active' : ''}">
                    <a class="nav-link" href="/page/order">订单</a>
                </li>
                <li class="nav-item" th:classappend="${session.page == 'user' ? 'active' : ''}"
                    th:if="${session.currentUser.superUser}">
                    <a class="nav-link" href="/page/user">用户</a>
                </li>
                <li class="nav-item" th:classappend="${session.page == 'config' ? 'active' : ''}"
                    th:if="${session.currentUser.superUser}">
                    <a class="nav-link" href="/page/config">配置</a>
                </li>
                <li id="user-nav-item" class="nav-item dropdown active">
                    <a href="javascript:" class="nav-link dropdown-toggle" data-toggle="dropdown">
                        <img th:src="${session.currentUser.avatarUrl} ?: '/images/avatar.jpg'"
                             class="rounded-circle avatar" alt="avatar">
                        <span th:text="${session.currentUser.userName}"></span>
                    </a>
                    <div class="dropdown-menu">
                        <a href="/logout" class="dropdown-item">退出系统</a>
                    </div>
                </li>
            </ul>
        </div>
    </nav>

    <div class="card page-content">
        <div layout:fragment="content"></div>
        <div class="card-footer bg-transparent text-muted">
            <p class="float-right">
                <a href="javascript:">回到顶部</a>
            </p>
            <p>主办单位：吉林省商务厅</p>
        </div>
    </div>

    <script src="/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="/libs/popper.js/1.12.9/umd/popper.min.js"></script>
    <script src="/libs/twitter-bootstrap/4.0.0/js/bootstrap.min.js"></script>
    <script src="/libs/moment.js/2.21.0/moment.min.js"></script>
    <script src="/libs/moment.js/2.21.0/locale/zh-cn.js"></script>
    <script src="/libs/bootstrap-select/1.12.4/js/bootstrap-select.min.js"></script>
    <script src="/libs/bootstrap-select/1.12.4/js/i18n/defaults-zh_CN.min.js"></script>
    <script src="/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>
    <script src="/js/template.js"></script>
    <script src="/js/layout.js"></script>
    <script th:src="@{/js/{page}.js(page=${session.page})}"></script>
</body>

</html>
